<template>
  <div class="bread">
    <div class="container">
      <span class="text fl"> 您的当前位置：</span>
      <el-breadcrumb class="fl" separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>热门活动</el-breadcrumb-item>
        <el-breadcrumb-item>慈善</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
  </div>
</template>

<style scoped>
.bread {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  line-height: 2.8125rem;
  font-size: 0.875rem;
  color: #4d4d4d;
}
.bread > div > div {
  line-height: 2.8125rem;
  display: inline-block;
}
.bread a {
  color: #4d4d4d;
  font-weight: normal !important;
}
.bread span.text {
  display: inline-block;
  line-height: 2.8125rem;
  font-size: 0.875rem;
}
.bread a:last-child {
  color: #de5044 !important;
}
.el-breadcrumb__inner a,
.el-breadcrumb__inner.is-link {
  font-weight: normal !important;
}
</style>